:local(.Overlay) {
  display: flex;
  flex: auto;
  flex-direction: column;

  width: 300px;

  padding: 0;
  z-index: 1001;

  border: 1px solid var(--overlay-border-color);
  box-shadow: 0 -2px 12px var(--color-000000-opacity-15);

  background-color: var(--overlay-background-color);
  color: var(--overlay-font-color);

  font-size: 14px;

  a[href] {
    color: var(--overlay-link-color);
    text-decoration: none;
  }

  :focus {
    outline: none;
  }

  :focus-visible {
    outline-style: auto;
    outline-color: var(--focus-outline-color);
  }

  .overlay__header,
  .overlay__body,
  .overlay__footer {
    padding: 12px;
  }

  .overlay__body:not(:first-child) {
    padding-top: 0;
  }

  .overlay__header {
    font-size: inherit;
  }

  .overlay__title {
    margin: 0;

    font-size: inherit;
    font-weight: normal;
    color: var(--overlay-title-color);
  }

  .overlay__body {
    font-size: inherit;
  }

  .overlay__footer {
    border-top: 1px solid var(--overlay-border-color);
  }
}
